<template>
  <div class="student">
    <el-card>
      <div class="search">
        <el-form :inline="true">
          <el-form-item label="用户名：">
            <el-input v-model="name" clearable />
          </el-form-item>
          <el-form-item>
            <el-button type="primary">查询</el-button>
            <el-button type="success" @click="add">添加</el-button>
          </el-form-item>
        </el-form>
      </div>
      <!-- 列表 -->
      
    </el-card>
  </div>
</template>
<script setup lang="ts">
import UserAPI, { type UserParams, type UserType } from "@/api/system/user.api"
import { ref } from "vue"
import { ElMessage } from 'element-plus'
let name = ref("")
import { useRouter } from "vue-router"
const tableData = ref<UserType[]>([])
const currentPage4 = ref(1)
const pageSize4 = ref(10)
const handleSizeChange = (val: number) => {
  console.log(`${val} items per page`)
  params.value.pageSize = val
  getLIst()
}
const handleCurrentChange = (val: number) => {
  console.log(`current page: ${val}`)
  params.value.pageIndex = val
  getLIst()
}
const formatGrade = (row: any) => {
  // 小学：1-6年级
  if (row.userLevel >= 1 && row.userLevel <= 6) {
    return `${row.userLevel}年级`;
  }
  // 初中：7-9年级对应初一到初三
  else if (row.userLevel === 7) return '初一';
  else if (row.userLevel === 8) return '初二';
  else if (row.userLevel === 9) return '初三';
  // 高中：10-12年级对应高一到高三
  else if (row.userLevel === 10) return '高一';
  else if (row.userLevel === 11) return '高二';
  else if (row.userLevel === 12) return '高三';
  // 异常值处理
  else return '未知年级';
};
const formatSex = (row: any) => {
  switch (row.sex) {
    case 1:
      return '男';
    case 2:
      return '女';
    default:
      return "其它";
  }
}
// 接口参数
let params = ref<UserParams>({
  userName: "",
  role: 1,
  pageIndex: 1,
  pageSize: 10
})
// 获取列表
function getLIst() {
  UserAPI.getUserPage(params.value).then(data => {
    console.log(data);
    tableData.value = data.list
  })
}
onMounted(async () => {
  getLIst()
})
const router = useRouter()
function delete1(id: number) {
  ElMessageBox.confirm(
    '是否确认删除',
    'Warning',
    {
      confirmButtonText: '确认',
      cancelButtonText: '取消',
      type: 'warning',
    }
  )
    .then(() => {
      UserAPI.delete(id).then(data => {
        console.log(data);
        ElMessage({
          message: '删除成功',
          type: 'success',
        })
        getLIst()
      })
      ElMessage({
        type: 'success',
        message: '删除成功',
      })
    })
    .catch(() => {
      ElMessage({
        type: 'info',
        message: '取消删除',
      })
    })


}
function add() {
  console.log(1);
  router.push("studentadd")
}
</script>
<style scoped lang="scss">
.student {
  padding: 16px;
}
</style>